<template>
  <div class="demo6">
    {{chooseIndex}}
    <div v-for="(item,index) in issucessList" :class="{
    'active':chooseIndex===index
    }" @click="select(index)">
      {{item.title}}
    </div>
    <div>
      {{bodyString}}
    </div>
  </div>

</template>

<script>
  import axios from 'axios'

  var url = 'https://api.github.com/repos/eyasliu/blog/issues'
  export default {
    name: 'demo6',
    components: {},
    props: {},
    data() {
      return {
        issucessList: [],
        chooseIndex: 0,
        bodyString: ''
      };
    },
    mounted() {
      axios.get(url).then(res => {
        console.log(res)
        this.issucessList = res.data
        this.bodyString = res.data[this.chooseIndex].body
      })
    },
    methods: {
      select(index) {
        this.chooseIndex = index
        this.bodyString = this.issucessList[index].body
      }
    },
    computed: {}
  };
</script>

<style scoped lang="less">
  .demo6 {
    .active {
      color: blue;
    }
  }
</style>
<style lang="less">
  .demo6 {
  }
</style>
